import 'package:flutter/material.dart';

// 使用占位
import 'package:transparent_image/transparent_image.dart';

class FadeInImageApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final String appTitle = 'Fade In Image Demo';
    return MaterialApp(
      title: appTitle,
      theme: ThemeData(primarySwatch: Colors.red),
      home: FadeInImagePage(title: appTitle),
    );
  }
}

class FadeInImagePage extends StatefulWidget {
  final String title;

  FadeInImagePage({Key key, this.title}) : super(key: key);

  @override
//  State<StatefulWidget> createState() => FadeInImagePageState();
  State<StatefulWidget> createState() => FadeInImagePageState1();
}

class FadeInImagePageState extends State<FadeInImagePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Stack(
        children: <Widget>[
          Center(
            child: CircularProgressIndicator(),
          ),
          Center(
            child:
                // 进度条加载进度
                FadeInImage.memoryNetwork(
                    placeholder: kTransparentImage,
                    image:
                        'http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fpic.58pic.com%2F58pic%2F13%2F80%2F78%2F35V58PICrWD_1024.jpg&thumburl=http%3A%2F%2Fimg1.imgtn.bdimg.com%2Fit%2Fu%3D2569486047%2C3428433554%26fm%3D26%26gp%3D0.jpg'),
          )
        ],
      ),
    );
  }
}

class FadeInImagePageState1 extends State<FadeInImagePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        body: Center(
          child:
              // image图片加载进度
              FadeInImage.assetNetwork(
                  placeholder: 'images/loading.gif',
                  image:
                      'http://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=http%3A%2F%2Fpic.58pic.com%2F58pic%2F13%2F80%2F78%2F35V58PICrWD_1024.jpg&thumburl=http%3A%2F%2Fimg1.imgtn.bdimg.com%2Fit%2Fu%3D2569486047%2C3428433554%26fm%3D26%26gp%3D0.jpg'),
        ));
  }
}
